/* ==========================================
   EUPHORIC ADDICTION
   BLACK + CHAMPAGNE ROSE EDITION
   4IMAGES GALLERY
   INSPIRED BY EA ARTWORK
========================================== */

:root {
  --page: #000000;
  --dark: #080606;
  --panel: #100D0C;
  --panel-light: #1B1513;

  --copper: #B77D62;
  --bronze: #C99478;
  --gold: #E8BFA6;

  --text: #EAD5C7;
  --muted: #B49D90;
  --border: #60483E;
}

/* PAGE BACKGROUND */

html,
body {
  background: #000000 !important;
  background-image: none !important;
}

body {
  font-family: Tahoma, Arial, sans-serif;
  font-size: 9px;
  color: var(--text);
  margin: 0;
  scrollbar-color: #79594B #000000;
}

/* LINKS */

a:link,
a:visited {
  color: #D6A58B;
  text-decoration: none;
}

a:active,
a:hover {
  color: #F0D8C8;
  text-decoration: none;
  cursor: crosshair;
}

hr {
  height: 1px;
  border: 0;
  background: #60483E;
}

ul, li, p, td {
  font-size: 9px;
}

/* TABLE STRUCTURE */

.tablehead,
.tablebgcolor {
  background-color: #100D0C;
  color: #EAD5C7;
  border: 0;
}

.tablebottom {
  background-color: #080606;
  background-image: none;
  padding: 0;
  height: 12px;
  border-top: 1px solid #60483E;
}

.bordercolor {
  background-color: #60483E;
}

/* NAVIGATION */

.navbar {
  background: linear-gradient(
    to bottom,
    #30221D 0%,
    #1B1513 45%,
    #080606 100%
  );
  font-family: Tahoma;
  font-size: 10px;
  color: #EAD5C7;
  font-weight: bold;
  padding: 5px;
  height: 30px;
  border-top: 1px solid #B77D62;
  border-bottom: 1px solid #60483E;
}

.navbar a,
.navbar a:visited {
  color: #EAD5C7;
  font-weight: bold;
}

.navbar a:hover {
  color: #F0D8C8;
}

/* FOOTER */

.footer {
  background-color: transparent;
  color: #B49D90;
  font-family: Tahoma;
  font-size: 9px;
}

.footer a:link,
.footer a:visited {
  color: #D6A58B;
}

.footer a:hover {
  color: #F0D8C8;
}

/* TABLE ROWS */

.row1 {
  background-color: #100D0C;
  color: #EAD5C7;
  padding: 4px;
}

.row2 {
  background-color: #171110;
  color: #EAD5C7;
  padding: 4px;
}

/* HEADERS */

.head1 {
  background: linear-gradient(
    to bottom,
    #30221D,
    #100D0C
  );
  color: #E8BFA6;
  border-top: 1px solid #B77D62;
  border-bottom: 1px solid #60483E;
  padding: 4px 4px 4px 10px;
  font-family: Tahoma;
  font-size: 10px;
  font-weight: bold;
  letter-spacing: 1px;
}

.head2 {
  background: linear-gradient(
    to bottom,
    #1B1513,
    #080606
  );
  color: #EAD5C7;
  border-bottom: 1px solid #60483E;
  padding: 4px 4px 4px 10px;
  font-family: Tahoma;
  font-size: 10px;
  font-weight: bold;
}

.head3 {
  background-color: #171110;
  border-top: 0;
  border-bottom: 0;
  padding: 3px;
  color: #C9B2A3;
  font-size: 9px;
  font-weight: normal;
}

/* TYPOGRAPHY */

.title {
  font-family: Tahoma;
  font-size: 11px;
  font-weight: bold;
  color: #E8BFA6;
}

.clickstream {
  font-family: Tahoma;
  font-size: 9px;
  color: #B49D90;
}

.smalltext {
  font-family: Tahoma;
  font-size: 9px;
  font-weight: normal;
  color: #B49D90;
}

.marktext {
  color: #080606;
  background-color: #D6A58B;
}

.new {
  font-family: Tahoma;
  font-size: 11px;
  color: #E8BFA6;
}

/* FORMS */

form {
  font-family: Tahoma;
  font-size: 9px;
}

.logininput,
.searchinput,
.textarea,
.input,
.select,
.setperpageselect,
.categoryselect,
.dropdownmarker,
.commenttextarea,
.commentinput {
  background-color: #080606;
  font-family: Tahoma;
  color: #EAD5C7;
  font-size: 9px;
  border: 1px solid #60483E;
  padding: 3px;
  outline: none;
}

.logininput {
  width: 160px;
  margin-left: 4px;
}

.searchinput {
  width: 130px;
}

.textarea,
.input {
  width: 230px;
}

.commenttextarea,
.commentinput {
  width: 370px;
  max-width: 95%;
  box-sizing: border-box;
}

.logininput:focus,
.searchinput:focus,
.textarea:focus,
.input:focus,
.select:focus,
.commenttextarea:focus,
.commentinput:focus {
  border-color: #D6A58B;
  background-color: #171110;
}

/* BUTTONS */

.button {
  background: linear-gradient(
    to bottom,
    #30221D,
    #080606
  );
  color: #EAD5C7;
  border: 1px solid #B77D62;
  font-family: Tahoma;
  font-size: 9px;
  font-weight: normal;
  padding: 4px 8px;
  cursor: pointer;
}

.button:hover {
  background: #49372F;
  color: #F0D8C8;
  border-color: #D6A58B;
}

/* CATEGORIES */

.catbgcolor {
  background: linear-gradient(
    to bottom,
    #30221D,
    #100D0C
  );
  border-top: 1px solid #B77D62;
  border-bottom: 1px solid #60483E;
}

.maincat {
  font-family: Tahoma;
  font-size: 9px;
  font-weight: bold;
  color: #E8BFA6;
}

.subcat {
  font-family: Tahoma;
  font-size: 9px;
  font-weight: normal;
  color: #C9B2A3;
}

/* IMAGE GALLERY */

.imagerow1 {
  background-color: transparent;
  color: #EAD5C7;
  padding: 7px;
}

.imagerow2 {
  background-color: transparent;
  color: #EAD5C7;
}

/* COMMENTS */

.commentrow1 {
  background-color: #100D0C;
  color: #EAD5C7;
}

.commentrow2 {
  background-color: #171110;
  color: #EAD5C7;
}

.commentspacerrow {
  background-color: #080606;
  color: #EAD5C7;
}

/* SIDEBAR */

.left {
  background-color: #000000;
  background-image: none;
  padding: 0;
}

/* MAIN CONTENT */

.main {
  background-color: #000000;
  background-image: none;
  border-bottom: 0;
  border-top: 1px solid #B77D62;
}

/* BOXES */

.box_back {
  background-color: #000000;
  color: #EAD5C7;
  padding: 2px;
}

/* FINISHING DETAILS */

img {
  border-color: #60483E;
}

a img {
  border-color: #60483E;
}

a:hover img {
  border-color: #D6A58B;
}

::selection {
  background: #B77D62;
  color: #000000;
}

/* MODERN SCROLLBAR */

::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

::-webkit-scrollbar-track {
  background: #000000;
}

::-webkit-scrollbar-thumb {
  background: #60483E;
  border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
  background: #B77D62;
}

/* SEAMLESS BLACK GALLERY FINISH */

.imagerow1,
.imagerow2,
.main,
.box_back {
  background-color: #000000;
  background-image: none;
}

/* SOFT CHAMPAGNE ACCENTS */

a:hover,
.maincat:hover {
  color: #F0D8C8;
}

/* SUBTLE METALLIC IMAGE HOVER */

a:hover img {
  border-color: #D6A58B;
  transition: border-color 0.25s ease;
}